<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 1.引入重置样式表 -->
    <link rel="stylesheet" href="../css/reset.css" />
    <!-- 2.引入常态化样式表 -->
    <link rel="stylesheet" href="../css/normalize.css" />
    <!-- 3.引入公共样式 -->
    <link rel="stylesheet" href="../css/common.css" />
    <!-- 5.引入当前页样式 -->
    <link rel="stylesheet" href="../css/change.css" />
</head>

<body>
    <main class="rel">
        <div class="img"></div>
        <div class="bigBox">
            <div class="box">
                <div>
                    <img src="../imgs/loginlogo.png" alt="图片已损坏">
                    <p class="maskText">
                        <a href="#" class="on">账号登录</a>
                        <span>|</span>
                        <a href="#">扫码登录</a>
                    </p>
                </div>
                <!-- 表单登录区域 -->
                <form id="loginForm" action="index.html" method="post">
                    <p>
                        <span></span>
                        <input type="text" name="" id="" placeholder="用户名/手机号/邮箱" />
                    </p>
                    <p>
                        <span></span>
                        <input type="password" name="" id="" placeholder="密码" />
                    </p>
                    <!-- 忘记密码 -->
                    <p class="getpwd">
                        <a href="#">忘记密码</a>

                    </p>
                    <!-- 登录 -->
                    <p>
                        <input type="submit" name="" id="but" value="登录">
                    </p>
                    <!-- 立即注册 -->
                    <p class="reg">还没有账号，<a>立即注册&gt;</a></p>
                </form>
                <!-- 扫码登录区 -->
                <form id="sweep" action="index.html" method="post">
                    <div class="qrcode">
                        <img src="../imgs/wechat-white.png" alt="图片已损坏">
                        <p>微信扫码登录</p>
                        <p>未关注源码科技公众号，请先关注后再登录</p>
                    </div>
                    <p id="regis">还没有源码账号，
                        <a href="#">立即注册&gt;</a>
                    </p>
                </form>

            </div>
        </div>
    </main>
    <script src="../js/util.js"></script>
    <script src="../js/change.js"></script>
</body>

</html>